<template>
  <div class="loading-wrap" v-show="show">
    <div class="inner">
      <img src="../assets/loading.gif" alt="" />
    </div>
  </div>
</template>

<script>
export default {
  props: {
    show: Boolean,
  },

  data() {
    return {};
  },
  methods: {},
  created() {},
  mounted() {},
  components: {},
  computed: {},
  watch: {},
};
</script>

<style lang="scss" scoped>
.loading-wrap {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;

  background: rgba(0, 0, 0, 0.3);
  .inner {
    width: 100px;
    height: 100px;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    img {
      width: 100%;
      height: 100%;
    }
  }
}
</style>
